<template>
  <div class="container">
    <div class="logo">
      <slot name="logo"></slot>
    </div>
    <div class="main">
      <slot name="main"></slot>
    </div>
    <div class="signIn">
      <slot name="signIn"></slot>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
.zIndex {
  position: relative;
  display: flex;
  z-index: 999;
}
.container {
  display: flex;
  padding: 10px 10px;
  background: #ccc;
  height: 70px;
  left: 0;
  right: 0;
  top: 0;
  position: fixed;
  background: #f4f4f4;
  overflow: hidden;
}
.logo {
  width: 100px;
}
.main {
  flex: 1;
  padding: 0 30px;
}
.signIn {
  width: 68px;
}
</style>